<%@page import="java.util.List"%>
<%@page import="com.qububu.play.common.dto.ArticleDetailMsgDto"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%
String path = request.getContextPath();
ArticleDetailMsgDto article = (ArticleDetailMsgDto) request.getAttribute("article");
List<ArticleDetailMsgDto> sonMsgList = (List<ArticleDetailMsgDto>) request.getAttribute("sonMsgList");
%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title><%=article.getMsgTitle() %></title>
</head>
<script type="text/javascript" charset="UTF-8" src="<%=path%>/resource/js/jquery/jquery-1.8.2.js"></script>
<script type="text/javascript" src="<%=request.getContextPath() %>/resource/js/jquery/jquery.cookie.js"></script>
<script type="text/javascript" charset="UTF-8" src="<%=path %>/resource/js/honeycombtool.js"></script>
<script type="text/javascript" charset="UTF-8" src="<%=path %>/resource/js/constants.js"></script>
<script type="text/javascript" charset="UTF-8" src="<%=path %>/resource/js/ajax_constants.js"></script>
<script charset="utf-8" src="<%=path%>/resource/iKindEditor/editor/kindeditor.js"></script>
<script charset="utf-8" src="<%=path%>/resource/iKindEditor/editor/lang/zh_CN.js"></script>
<script charset="utf-8" src="<%=path%>/resource/iKindEditor/editor/plugins/code/prettify.js"></script>
<script charset="utf-8" src="<%=path%>/resource/js/showPost.js"></script>
<style type="text/css">
img {
	max-width: 870px;
	_width: expression((document.documentElement.clientWidth || document.body.clientWidth) > 870 ? "870px" : "auto");
}
.reply{
	border: none; 
	border-style: none; 
	width: 50px; 
	height: 20px; 
	border-radius: 2px; 
	background: #8CC700/* #51AB02 */; 
	color: #FFFFFF; 
	cursor: pointer;
	font-size: 12px;
	text-align: center;
	line-height: 20px;
	text-align: center;
	}

.loadMoreMessageDialogStyle {
background: #EDEDED;
text-align: center;
}

.loadMoreMessageDialogStyle img{
	margin: 2px;
	height: 28px; 
}

</style>
<body>
<%@ include file="top.jsp" %>
	<input id="article_type" type="hidden" value="DINE" />
	<input id="articleId" type="hidden" value="<%=article.getArticleId() %>" />
	<div style="width: 980px;height: auto;margin: 0 auto;border: 1px solid #dddddd;padding-left: 20px;">
		<div style="width: 960px;height: 35px;border-bottom: 1px solid #999999;">
			<div style="float: left; width: 770px;height: 30px;margin-left: 10px;font-size: 18px;text-align: left;line-height: 35px;font-weight: bold"><%=article.getMsgTitle() %></div>
			<!-- <div style="float: left;width: 80px;height: 30px;margin-right: 10px;margin-top: 5px;">
				<input type="button" value="只看楼主" style="height: 25px;text-align: center;width: 80px;">
			</div>
			<div style="float: left;width: 80px;height: 30px;margin-right: 10px;margin-top: 5px;">
				<a href="#allReply" style="text-decoration: none; ">
				<input type="button" value="回复" style="height: 25px;text-align: center;width: 80px;">
				</a>
			</div> -->
			<div style="clear: both;"></div>
		</div>
		<!-- 一条完整滴回复 -->
		<div style="width: 960px;height: auto; margin-top: 20px; margin-bottom: 20px;">
			<div style="float: left;width: 50px;height: 50px;border: 0 none;border-radius: 4px 4px 4px 4px; overflow: hidden; margin-top: 20px; ">
				<img style="width:50px;height: 50px; " src="<%=article.getAuthor().getUserLogoUrl() %>">
			</div>
			<div style="float: left;width: 870px;height: auto;margin-top: 20px;margin-left: 20px;">
				<div style="width: 870px;height: 20px;margin-bottom: 10px;line-height: 20px;font-size: 15px;color: #946652">贴主:<%=article.getAuthor().getAuthorName() %></div>
				<div style="width: 870px;height: auto;margin-bottom: 10px;line-height: 20px;font-size: 15px;"><%=article.getMsgContent() %></div>
				<div style="width: 870px;height: 20px;margin-bottom: 10px;line-height: 20px;font-size: 15px;">
					<div style="float: left;padding: 0 5px 0 5px;width: auto;height: 20px;line-height: 20px;font-size: 15px;color: #9B9B9B;"><%=article.showTimeToDT() %></div>
					<!-- <div style="float: left;padding: 0 5px 0 5px; width: auto;height: 20px;line-height: 20px;font-size: 15px; color: #946652;margin-left: 650px;">赞</div> -->
					<div style="float: left;padding: 0 5px 0 5px;width: auto;height: 20px;line-height: 20px;font-size: 15px;color: #946652;margin-left: 10px; cursor: pointer;"><a href="#submitReplay">评论</a></div>
				</div>
			</div>
			<div style="clear:both;"></div>
			<!-- 对某一个进行评论 -->
			<%-- <div id ="reply" style="width: 870px;height: auto;border: 1px solid #dadada;margin-bottom: 20px;margin-left: 70px;display: none;padding: 10px;">
				<div style="width: 870px;height: auto;line-height: 20px;font-size: 15px;margin-bottom: 20px;">
					<div style="width: 870px;height: 50px;line-height: 20px;">
						<input type="text" style="width: 870px;height: 50px;line-height: 20px;border: 1px solid #dadada;">
					</div>
					<div style="width: 870px;height: 20px;line-height: 20px;margin-top: 5px;">
						<div style="float: left;width: 20px;height: 20px;">
							<img style="width:20px;height: 20px; " src="<%=path %>/resource/images/play/expression_button.png">
						</div>
						<div style="float: left;width:50px;height: 20px;margin-left: 800px; ">
							<img style="width:50px;height: 20px; " src="<%=path%>/resource/images/play/reply_button.png">
						</div>
					</div>
				</div>
				<div style="width: 870px;height: auto;line-height: 20px;font-size: 15px;">
					<div style="float: left;width: 30px;height: 30px;border: 0 none;border-radius: 2px 2px 2px 2px; overflow: hidden;">
						<img style="width:50px;height: 50px; " src="<%=path%>/resource/images/play/touxiang.jpg">
					</div>
					<div style="float: left;width: 825px;height: auto;line-height: 20px;font-size: 15px;margin-left: 10px; "><span style="color: #946652;">昵称</span>船长觉得这个游戏相当的有意思，特别适合有强迫症的人玩，我喵的花了整整一个下午啊，整整一个下午，终于通关了，通关之后突然感觉到我找到了新的人生方向，一切都变得那么的明亮，追逐梦想的道路上我也不在迷茫，就连腰酸背痛腿抽筋都治好了</div>
					<div style="clear:both;"></div>
					<div style="width: 825px;height: 20px;line-height: 20px;font-size: 15px;margin-left: 40px; ">
						<div style="float: left;padding: 0 5px 0 5px;width: auto;height: 20px;line-height: 20px;font-size: 15px;color: #9B9B9B;">2013.1.1 00:00</div>
						<div style="float: left;padding: 0 5px 0 5px;width: auto;height: 20px;line-height: 20px;font-size: 15px;color: #946652;margin-left: 655px; ">回复</div>
					</div>
				</div>
			</div> --%>
		</div>
		<%
		if (sonMsgList != null && sonMsgList.size() > 0) {
			int messageNum = sonMsgList.size();
			ArticleDetailMsgDto articleMessage = null;
			for (int i = 0; i < messageNum; i++) {
				articleMessage = sonMsgList.get(i);
		%>
		<div style="width: 960px;height: auto; border-top: 1px solid #dadada; margin-top: 20px; margin-bottom: 20px;">
			<div style="float: left;width: 50px;height: 50px;border: 0 none;border-radius: 4px 4px 4px 4px; overflow: hidden; margin-top: 20px; ">
				<img style="width:50px;height: 50px; " src="<%=articleMessage.getAuthor().getUserLogoUrl() %>">
			</div>
			<div style="float: left;width: 870px;height: auto;margin-top: 20px;margin-left: 20px;">
				<div style="width: 870px;height: 20px;margin-bottom: 10px;line-height: 20px;font-size: 15px;color: #946652"><%=articleMessage.getAuthor().getAuthorName() %></div>
				<div style="width: 870px;height: auto;margin-bottom: 10px;line-height: 20px;font-size: 15px;"><%=articleMessage.getMsgContent() %></div>
				<div style="width: 870px;height: 20px;margin-bottom: 10px;line-height: 20px;font-size: 15px;">
					<div style="float: left;padding: 0 5px 0 5px;width: auto;height: 20px;line-height: 20px;font-size: 15px;color: #9B9B9B;"><%=articleMessage.showTimeToDT() %></div>
					<div style="float: left;padding: 0 5px 0 5px;width: auto;height: 20px;line-height: 20px;font-size: 15px;color: #946652;margin-left: 10px; cursor: pointer;"><a href="#submitReplay">评论</a></div>
				</div>
			</div>
			<div style="clear:both;"></div>
		</div>
		<%
			}
		%>
		<div id="moreMessageBox" style="height: auto; width: 960px; display: none;">
				
		</div>
		<%
			if (messageNum == 25) {
		%>
		<div style="width: 400px; text-align: center; height: 30px; line-height: 30px; background: #EDEDED; border: 2px solid #F0F0EE; cursor: pointer; margin: 20px 260px;" id="moreMessage">更多评论</div>
		<%		
			}	
		} else {
		%>
		<div id="moreMessageBox" style="height: auto; width: 960px; display: none;">
			
		</div>
		<%
		}
		%>
		<!-- 对整个帖子进行评论 -->
		<div id="allReply" style="width: 960px; height: 200px;">
			<div style="width: 900px; margin-left: 30px; height: 170px;">
				<textarea id="inputTextArea" style="width: 900px; height: 130px; overflow:auto; resize:none"></textarea>
			</div>
			<div id="submitReplay" style="float: right; width: 50px; height: 20px; margin-top: 5px; margin-right: 29px; cursor: pointer;">
				<div class="reply" style="width:50px;height: 20px; ">评论</div>
				<input class="messageId" type="hidden" value="<%=article.getMsgId() %>" />
			</div>
			<div style="clear: both;"></div>
		</div>
</div>
<%@ include file="foot.jsp" %>
</body>
</html>